<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>零点房控终端</title>
</head>
<body style="padding: 0;margin: 0" id="app">
<div style="height: 100vh;width: 100%;background: #F0F0F0">
    <div style="padding: 10px">
        <div class="header_content_one">
            <div style="width: 100px;font-size: 12px;text-align: right">绑定商户名称：</div>
            <div style="display: flex;flex-direction: row;align-items: center">
                <input v-model="shop_name" disabled class="input_content" style="width: 140px"></input>
            </div>
            <div style="width: 65px;font-size: 12px;text-align: right">请求地址：</div>
            <div style="display: flex;flex-direction: row;align-items: center;margin-left: 10px">
                <input disabled v-model="request_hide" class="input_content"></input>
            </div>
            <div style="width: 80px;font-size: 12px;text-align: right">Socket地址：</div>
            <div style="display: flex;flex-direction: row;align-items: center;margin-left: 10px">
                <input disabled v-model="socket_address" class="input_content"></input>
            </div>
        </div>
        <div class="header_content">
            <div style="width: 100px;font-size: 12px;text-align: right">终端通讯地址：</div>
            <div style="display: flex;flex-direction: row;align-items: center;">
                <input v-model="server_ip" class="input_content"></input>
            </div>
            <div style="width: 65px;font-size: 12px;text-align: right">通讯端口：</div>
            <div style="display: flex;flex-direction: row;align-items: center;">
                <input style="width: 46px" v-model="server_port" class="input_content"></input>
            </div>
            <div style="display: flex;flex-direction: row;align-items: center;margin-left: 10px">
                <button class="button_style" @click="initGetTerminal()">手 动 获 取 终 端</button>
            </div>
        </div>
        <div class="header_content">
            <div style="width: 100px;font-size: 12px;text-align: right">通讯包厢IP：</div>
            <div style="display: flex;flex-direction: row;align-items: center">
                <input v-model="room_ip" class="input_content"></input>
            </div>
            <div style="display: flex;flex-direction: row;align-items: center;margin-left: 10px">
                <button class="button_style" @click="openRoom()">开 房</button>
            </div>
            <div style="display: flex;flex-direction: row;align-items: center;margin-left: 10px">
                <button class="button_style" @click="closeRoom()">关 房</button>
            </div>
            <div style="display: flex;flex-direction: row;align-items: center;margin-left: 10px">
                <button class="button_style" @click="changeRoom">转 房 至</button>
            </div>
            <div style="width: 50px;font-size: 12px;text-align: right;margin-left: 10px">包厢IP：</div>
            <div style="display: flex;flex-direction: row;align-items: center;">
                <input v-model="change_room_ip" class="input_content"></input>
            </div>
        </div>
        <div class="header_content">
            <div style="width: 100px;font-size: 12px;text-align: right">发送总台消息：</div>
            <div style="display: flex;flex-direction: row;align-items: center">
                <input v-model="msg_data" style="width: 364px" placeholder="请输入消息内容"
                       class="input_content"></input>
            </div>
            <div style="display: flex;flex-direction: row;align-items: center;margin-left: 10px">
                <select v-model="msg_flag" id="msg" name="msg"
                        style="outline: none;width: 100px;height: 24px;box-shadow: 1px 1px 3px rgb(0 0 0 / 50%) inset;border: none">
                    <option value="1">滚动消息</option>
                    <option value="2">弹出消息</option>
                </select>
            </div>
            <div style="display: flex;flex-direction: row;align-items: center;margin-left: 10px">
                <button class="button_style" @click="sendMessage">
                    发 送 消 息
                </button>
            </div>
        </div>
        <div class="header_content">
            <div style="width: 100px;font-size: 12px;text-align: right">发送门牌状态：</div>
            <div style="display: flex;flex-direction: row;align-items: center">
                <select v-model="room_lamp_flag" id="status" name="status"
                        style="outline: none;width: 100px;height: 24px;box-shadow: 1px 1px 3px rgb(0 0 0 / 50%) inset;border: none">
                    <option value="1">空闲</option>
                    <option value="2">预定</option>
                    <option value="5">使用</option>
                </select>
            </div>
            <div style="display: flex;flex-direction: row;align-items: center;margin-left: 10px">
                <button class="button_style" @click="sendLampFlag">
                    发 送 门 牌 灯 指 令
                </button>
            </div>
        </div>
        <div class="header_content">
            <div style="width: 100px;font-size: 12px;text-align: right">终端UDP地址：</div>
            <div style="display: flex;flex-direction: row;align-items: center;">
                <input v-model="system_ip" class="input_content"></input>
            </div>
            <div style="width: 100px;font-size: 12px;text-align: right">UDP监听端口：</div>
            <div style="display: flex;flex-direction: row;align-items: center;">
                <input disabled style="width: 46px" v-model="system_port" class="input_content"></input>
            </div>
        </div>
        <div class="header_content">
            <div style="width: 100px;font-size: 12px;text-align: right">服务铃包厢IP：</div>
            <div style="display: flex;flex-direction: row;align-items: center">
                <input v-model="room_small_bell_ip" class="input_content"></input>
            </div>
            <div style="display: flex;flex-direction: row;align-items: center;margin-left: 10px">
                <button class="button_style" @click="sendServerRequest">
                    发 送 服 务 请 求
                </button>
                <button class="button_style" @click="sendServerResponse" style="margin-left: 10px">
                    服 务 响 应 请 求
                </button>
                <button class="button_style" style="margin-left: 10px" @click="sendSystemRequest">
                    服 务 反 馈
                </button>
                <button class="button_style" style="margin-left: 10px" @click="sendSystemResponse">
                    服 务 响 应
                </button>
            </div>
        </div>
        <div style="margin-top: 10px">
            <textarea v-model="text_value" disabled class="textarea_content"></textarea>
        </div>
    </div>
</div>
<script src="./js/vue.js"></script>
<script>
    const {createApp} = Vue
    const {ipcRenderer} = require('electron')
    const request = require('request')
    createApp({
        data() {
            return {
                server_port: '',
                system_port: '',
                server_ip: '',
                room_ip: '',
                room_name: '',
                change_room_ip: '',
                text_value: '',
                request_api_address: 'https://api.skunld.net',
                request_hide: '',
                shop_name: 'Wave 南亚KTV店',
                shop_id: 62,
                socket_address: 'http://0.0.0.0:9529',
                roll_number: 0,
                msg_flag: '1',
                msg_data: '',
                room_lamp_flag: '1',
                room_small_bell_ip: '192.168.10.110',
                system_ip: '',
                clearTimeout:''
            }
        },
        mounted() {
            this.requestHide()
            this.initGetTerminal()
            // 使用箭头函数避免作用域问题 获取接收的udp信息
            ipcRenderer.on('message-from-main-udp', (event, message) => {
                this.text_value += message + '\n';
            });
            // 服务铃接收消息进行处理
            ipcRenderer.on('message-from-main-udp-status', (event, message) => {
                const requestData = JSON.parse(message)
                // 服务铃开启
                if (requestData.status === 'open' || requestData.status === 'close') {
                    this.sendOpenSystem(message)
                }
                // 服务铃手动关闭
                // if (requestData.status === 'close') {
                //
                // }
            })
            // 获取接收到的系统调用socket指令 如开房、关房、转房等
            ipcRenderer.on('message-from-main-socket', (event, message) => {
                const socketData = message
                if (socketData.status === 'open') {
                    this.room_ip = socketData.room_ip
                    this.room_name = socketData.room_name
                    this.openRoom()
                    return;
                }
                if (socketData.status === 'close') {
                    this.room_ip = socketData.room_ip
                    this.room_name = socketData.room_name
                    this.closeRoom()
                }
                if (socketData.status === 'changeRoom') {
                    this.room_ip = socketData.room_ip
                    this.room_name = socketData.room_name + '转' + socketData.change_room_name
                    this.change_room_ip = socketData.change_room_ip
                    this.changeRoom()
                }
                if (socketData.status === 'message') {
                    this.msg_flag = socketData.msg_flag
                    let dataFlag = socketData.msg_flag === '1' ? '滚动消息' : '弹出消息'
                    this.room_ip = socketData.room_ip
                    this.room_name = socketData.room_name + '包房' + dataFlag
                    this.roll_number = socketData.roll_number
                    this.msg_data = socketData.room_msg
                    this.sendMessage()
                }
                if (socketData.status === 'responseBell') {
                    this.room_small_bell_ip = socketData.room_ip
                    this.room_name = socketData.room_name
                    this.sendSystemRequest()
                }
            });
            this.sandInterval();
        },
        methods: {
            /**
             * 开房命令
             */
            openRoom() {
                let _this = this;
                // 主消息号 0x01 需要指定 offset 为 0
                const mainMsgNo = Buffer.alloc(4);
                mainMsgNo.writeUInt32LE(0x01, 0);
                // 子消息号 0x01 需要指定 offset 为 0
                const subMsgNo = Buffer.alloc(4);
                subMsgNo.writeUInt32LE(0x01, 0); //
                // 包厢IP地址转为 Buffer const boxIpBuffer = Buffer.from(_this.room_ip.split('.').map(octet => parseInt(octet, 10)));
                const boxIpBuffer = Buffer.alloc(4);
                // 版本，保持原样
                const versionBuffer = Buffer.alloc(4);
                // 预留字段，填充0 console.log('预留字段：' + reserved.toString('hex'))
                const reserved = Buffer.alloc(12);

                // 正文内容，使用协议指定的分隔符 ||
                const content = _this.room_ip;
                let body = Buffer.from(content); // 包正文部分
                // 正文长度，填充0
                const contentLength = Buffer.alloc(4);
                contentLength.writeUInt32LE(body.length, 0)
                console.log(contentLength.toString('hex'))
                // 头部内容
                const header = Buffer.concat([mainMsgNo, subMsgNo, boxIpBuffer, versionBuffer, reserved, contentLength]); // 包头部分
                // 初始化包内容
                let packet = Buffer.concat([header, body]);
                // 长度计算
                // const maxLength = 4096;
                // const paddingLength = maxLength - packet.length
                // 补足长度
                // const bufferLengthAll = Buffer.alloc(paddingLength, 0)
                // 真实正文内容
                // body = Buffer.concat([body, bufferLengthAll])
                // 最终包内容
                // packet = Buffer.concat([header, body]);
                let ip = _this.server_ip; // 目标服务器 IP
                let port = _this.server_port; // 目标服务器端口
                let room_name = _this.room_name ?? ''
                // 使用 ipcRenderer 发送 UDP 消息到主进程 将 Buffer 转为 hex 格式字符串 否则禁止传输
                ipcRenderer.send('send-udp-message', {
                    packet: packet.toString('hex'),
                    ip,
                    port,
                    room_name
                });
            },

            /**
             * 关房命令
             */
            closeRoom() {
                let _this = this; // 备份 this，避免在回调中出现作用域问题
                // 主消息号 0x01
                const mainMsgNo = Buffer.alloc(4);
                mainMsgNo.writeUInt32LE(0x01, 0);

                // 子消息号 0x01
                const subMsgNo = Buffer.alloc(4);
                subMsgNo.writeUInt32LE(0x02, 0);

                // 包厢IP地址转为 Buffer
                const boxIpBuffer = Buffer.alloc(4);

                // 版本，保持原样
                const versionBuffer = Buffer.alloc(4);

                // 预留字段，填充0
                const reserved = Buffer.alloc(12);

                // 正文内容，使用协议指定的分隔符 ||
                const content = _this.room_ip;
                let body = Buffer.from(content); // 包正文部分
                // 正文长度，填充0
                const contentLength = Buffer.alloc(4);
                contentLength.writeUInt32LE(body.length, 0)
                // 头部内容
                const header = Buffer.concat([mainMsgNo, subMsgNo, boxIpBuffer, versionBuffer, reserved, contentLength]); // 包头部分
                // 初始化包内容
                let packet = Buffer.concat([header, body]);
                // 长度计算 补足长度
                // const maxLength = 4096;
                // const paddingLength = maxLength - packet.length
                // const bufferLengthAll = Buffer.alloc(paddingLength, 0)
                // 真实正文内容
                // body = Buffer.concat([body, bufferLengthAll])
                // 最终包内容
                // packet = Buffer.concat([header, body]);
                let ip = _this.server_ip;
                let port = _this.server_port;
                let room_name = _this.room_name ?? ''
                ipcRenderer.send('send-udp-message', {
                    packet: packet.toString('hex'),
                    ip,
                    port,
                    room_name
                });
            },

            /**
             * 转房命令
             */
            changeRoom() {
                let _this = this; // 备份 this，避免在回调中出现作用域问题
                // 主消息号 0x01
                const mainMsgNo = Buffer.alloc(4);
                mainMsgNo.writeUInt32LE(0x01, 0);

                // 子消息号 0x01
                const subMsgNo = Buffer.alloc(4);
                subMsgNo.writeUInt32LE(0x03, 0);

                // 包厢IP地址转为 Buffer
                const boxIpBuffer = Buffer.alloc(4);

                // 版本，保持原样
                const versionBuffer = Buffer.alloc(4);

                // 预留字段，填充0
                const reserved = Buffer.alloc(12);

                // 正文内容，使用协议指定的分隔符 ||
                const content = _this.room_ip + '||' + _this.change_room_ip;
                let body = Buffer.from(content); // 包正文部分
                // 正文长度，填充0
                const contentLength = Buffer.alloc(4);
                contentLength.writeUInt32LE(body.length, 0)

                // 头部内容 包头部分
                const header = Buffer.concat([mainMsgNo, subMsgNo, boxIpBuffer, versionBuffer, reserved, contentLength]);

                // 初始化包内容
                let packet = Buffer.concat([header, body]);
                let ip = _this.server_ip; // 目标服务器 IP
                let port = _this.server_port; // 目标服务器端口
                let room_name = _this.room_name ?? ''
                // 使用 ipcRenderer 发送 UDP 消息到主进程 将 Buffer 转为 hex 格式字符串
                ipcRenderer.send('send-udp-message', {packet: packet.toString('hex'), ip, port, room_name});
            },

            /**
             * 请求隐藏
             */
            requestHide() {
                this.request_hide = this.request_api_address.replace('skunld.net', '------.net')
            },

            /**
             * 发送包房消息
             */
            sendMessage() {
                let _this = this; // 备份 this，避免在回调中出现作用域问题
                // 主消息号 0x01
                const mainMsgNo = Buffer.alloc(4);
                mainMsgNo.writeUInt32LE(0x01, 0);

                // 子消息号 0x01
                const subMsgNo = Buffer.alloc(4);
                subMsgNo.writeUInt32LE(0x04, 0);

                // 包厢IP地址转为 Buffer
                const boxIpBuffer = Buffer.alloc(4);

                // 版本，保持原样
                const versionBuffer = Buffer.alloc(4);

                // 预留字段，填充0
                const reserved = Buffer.alloc(12);

                // 正文内容，使用协议指定的分隔符 ||
                const content = _this.room_ip + '||' + _this.msg_flag + '||' + _this.roll_number + '||' + _this.msg_data;
                let body = Buffer.from(content); // 包正文部分
                // 正文长度，填充0
                const contentLength = Buffer.alloc(4);
                contentLength.writeUInt32LE(body.length, 0)

                // 头部内容 包头部分
                const header = Buffer.concat([mainMsgNo, subMsgNo, boxIpBuffer, versionBuffer, reserved, contentLength]);

                // 初始化包内容
                let packet = Buffer.concat([header, body]);
                let ip = _this.server_ip; // 目标服务器 IP
                let port = _this.server_port; // 目标服务器端口
                let room_name = _this.room_name ?? ''
                // 使用 ipcRenderer 发送 UDP 消息到主进程 将 Buffer 转为 hex 格式字符串
                ipcRenderer.send('send-udp-message', {packet: packet.toString('hex'), ip, port, room_name});
            },

            /**
             * 模拟发送服务铃消息
             */
            sendServerRequest() {
                let _this = this; // 备份 this，避免在回调中出现作用域问题
                // 主消息号 0x01
                const mainMsgNo = Buffer.alloc(4);
                mainMsgNo.writeUInt32LE(0x0A, 0);

                // 子消息号 0x01
                const subMsgNo = Buffer.alloc(4);
                subMsgNo.writeUInt32LE(0x01, 0);

                // 包厢IP地址转为 Buffer
                const boxIpBuffer = Buffer.alloc(4);
                let bell_room_ip = _this.room_small_bell_ip
                const ipParts = bell_room_ip.split('.').map(octet => parseInt(octet, 10));
                boxIpBuffer[0] = ipParts[0]; // 第一个字节
                boxIpBuffer[1] = ipParts[1]; // 第二个字节
                boxIpBuffer[2] = ipParts[2]; // 第三个字节
                boxIpBuffer[3] = ipParts[3]; // 第四个字节

                // 版本，保持原样
                const versionBuffer = Buffer.alloc(4);

                // 预留字段，填充0
                const reserved = Buffer.alloc(12);

                // 正文内容，使用协议指定的分隔符 ||
                const content = '0001' + '||' + '4';
                let body = Buffer.from(content); // 包正文部分
                // 正文长度，填充0
                const contentLength = Buffer.alloc(4);
                contentLength.writeUInt32LE(body.length, 0)

                // 头部内容 包头部分
                const header = Buffer.concat([mainMsgNo, subMsgNo, boxIpBuffer, versionBuffer, reserved, contentLength]);

                // 初始化包内容
                let packet = Buffer.concat([header, body]);
                let ip = _this.system_ip; // 目标服务器 IP
                let port = _this.system_port; // 目标服务器端口
                let room_name = '模拟房间' + bell_room_ip + '服务铃'
                // 使用 ipcRenderer 发送 UDP 消息到主进程 将 Buffer 转为 hex 格式字符串
                ipcRenderer.send('send-udp-message', {packet: packet.toString('hex'), ip, port, room_name});
            },

            /**
             * 模拟服务响应请求
             */
            sendServerResponse() {
                let _this = this; // 备份 this，避免在回调中出现作用域问题
                // 主消息号 0x01
                const mainMsgNo = Buffer.alloc(4);
                mainMsgNo.writeUInt32LE(0x0A, 0);

                // 子消息号 0x01
                const subMsgNo = Buffer.alloc(4);
                subMsgNo.writeUInt32LE(0x03, 0);

                // 包厢IP地址转为 Buffer
                const boxIpBuffer = Buffer.alloc(4);
                let bell_room_ip = _this.room_small_bell_ip
                const ipParts = bell_room_ip.split('.').map(octet => parseInt(octet, 10));
                boxIpBuffer[0] = ipParts[0]; // 第一个字节
                boxIpBuffer[1] = ipParts[1]; // 第二个字节
                boxIpBuffer[2] = ipParts[2]; // 第三个字节
                boxIpBuffer[3] = ipParts[3]; // 第四个字节

                // 版本，保持原样
                const versionBuffer = Buffer.alloc(4);

                // 预留字段，填充0
                const reserved = Buffer.alloc(12);

                // 正文内容，使用协议指定的分隔符 ||
                const content = '0001' + '||' + ''+'||'+'||'+'0';
                let body = Buffer.from(content); // 包正文部分
                // 正文长度，填充0
                const contentLength = Buffer.alloc(4);
                contentLength.writeUInt32LE(body.length, 0)

                // 头部内容 包头部分
                const header = Buffer.concat([mainMsgNo, subMsgNo, boxIpBuffer, versionBuffer, reserved, contentLength]);

                // 初始化包内容
                let packet = Buffer.concat([header, body]);
                let ip = _this.system_ip; // 目标服务器 IP
                let port = _this.system_port; // 目标服务器端口
                let room_name = '模拟房间' + bell_room_ip + '服务铃响应'
                // 使用 ipcRenderer 发送 UDP 消息到主进程 将 Buffer 转为 hex 格式字符串
                ipcRenderer.send('send-udp-message', {packet: packet.toString('hex'), ip, port, room_name});
            },

            /**
             * 服务反馈
             */
            sendSystemRequest() {
                let _this = this; // 备份 this，避免在回调中出现作用域问题
                // 主消息号 0x01
                const mainMsgNo = Buffer.alloc(4);
                mainMsgNo.writeUInt32LE(0x0A, 0);

                // 子消息号 0x01
                const subMsgNo = Buffer.alloc(4);
                subMsgNo.writeUInt32LE(0x02, 0);

                // 包厢IP地址转为 Buffer
                const boxIpBuffer = Buffer.alloc(4);
                let bell_room_ip = _this.room_small_bell_ip
                const ipParts = bell_room_ip.split('.').map(octet => parseInt(octet, 10));
                boxIpBuffer[0] = ipParts[0]; // 第一个字节
                boxIpBuffer[1] = ipParts[1]; // 第二个字节
                boxIpBuffer[2] = ipParts[2]; // 第三个字节
                boxIpBuffer[3] = ipParts[3]; // 第四个字节

                // 版本，保持原样
                const versionBuffer = Buffer.alloc(4);

                // 预留字段，填充0
                const reserved = Buffer.alloc(12);

                // 正文内容，使用协议指定的分隔符 ||
                const content = '0' + '||' + '呼叫成功';
                let body = Buffer.from(content); // 包正文部分
                // 正文长度，填充0
                const contentLength = Buffer.alloc(4);
                contentLength.writeUInt32LE(body.length, 0)

                // 头部内容 包头部分
                const header = Buffer.concat([mainMsgNo, subMsgNo, boxIpBuffer, versionBuffer, reserved, contentLength]);

                // 初始化包内容
                let packet = Buffer.concat([header, body]);
                let ip = _this.server_ip; // 目标服务器 IP
                let port = _this.server_port; // 目标服务器端口
                let room_name = _this.room_name + '手动服务反馈'
                // 使用 ipcRenderer 发送 UDP 消息到主进程 将 Buffer 转为 hex 格式字符串
                ipcRenderer.send('send-udp-message', {packet: packet.toString('hex'), ip, port, room_name});
            },

            /**
             * 服务响应
             */
            sendSystemResponse() {
                let _this = this; // 备份 this，避免在回调中出现作用域问题
                // 主消息号 0x01
                const mainMsgNo = Buffer.alloc(4);
                mainMsgNo.writeUInt32LE(0x0A, 0);

                // 子消息号 0x01
                const subMsgNo = Buffer.alloc(4);
                subMsgNo.writeUInt32LE(0x04, 0);

                // 包厢IP地址转为 Buffer
                const boxIpBuffer = Buffer.alloc(4);
                let bell_room_ip = _this.room_small_bell_ip
                const ipParts = bell_room_ip.split('.').map(octet => parseInt(octet, 10));
                boxIpBuffer[0] = ipParts[0]; // 第一个字节
                boxIpBuffer[1] = ipParts[1]; // 第二个字节
                boxIpBuffer[2] = ipParts[2]; // 第三个字节
                boxIpBuffer[3] = ipParts[3]; // 第四个字节

                // 版本，保持原样
                const versionBuffer = Buffer.alloc(4);

                // 预留字段，填充0
                const reserved = Buffer.alloc(12);

                // 正文内容，使用协议指定的分隔符 ||
                const content = '0' + '||' + '响应成功';
                let body = Buffer.from(content); // 包正文部分
                // 正文长度，填充0
                const contentLength = Buffer.alloc(4);
                contentLength.writeUInt32LE(body.length, 0)

                // 头部内容 包头部分
                const header = Buffer.concat([mainMsgNo, subMsgNo, boxIpBuffer, versionBuffer, reserved, contentLength]);

                // 初始化包内容
                let packet = Buffer.concat([header, body]);
                let ip = _this.server_ip; // 目标服务器 IP
                let port = _this.server_port; // 目标服务器端口
                let room_name = _this.room_name + '手动响应反馈'
                // 使用 ipcRenderer 发送 UDP 消息到主进程 将 Buffer 转为 hex 格式字符串
                ipcRenderer.send('send-udp-message', {packet: packet.toString('hex'), ip, port, room_name});
            },

            /**
             * 发送包房灯控制
             */
            sendLampFlag() {
                let _this = this; // 备份 this，避免在回调中出现作用域问题
                // 主消息号 0x01
                const mainMsgNo = Buffer.alloc(4);
                mainMsgNo.writeUInt32LE(0x15, 0);

                // 子消息号 0x01
                const subMsgNo = Buffer.alloc(4);
                subMsgNo.writeUInt32LE(0x00, 0);

                // 包厢IP地址转为 Buffer
                const boxIpBuffer = Buffer.alloc(4);

                // 版本，保持原样
                const versionBuffer = Buffer.alloc(4);

                // 预留字段，填充0
                const reserved = Buffer.alloc(12);

                // 正文内容，使用协议指定的分隔符 ||
                const content = '0' + '||' + '' + '||' + 1 + '||' + _this.room_lamp_flag;
                let body = Buffer.from(content); // 包正文部分
                // 正文长度，填充0
                const contentLength = Buffer.alloc(4);
                contentLength.writeUInt32LE(body.length, 0)

                // 头部内容 包头部分
                const header = Buffer.concat([mainMsgNo, subMsgNo, boxIpBuffer, versionBuffer, reserved, contentLength]);

                // 初始化包内容
                let packet = Buffer.concat([header, body]);
                let ip = _this.server_ip; // 目标服务器 IP
                let port = _this.server_port; // 目标服务器端口
                let room_name = _this.room_name + '门牌灯控制' ?? ''
                // 使用 ipcRenderer 发送 UDP 消息到主进程 将 Buffer 转为 hex 格式字符串
                ipcRenderer.send('send-udp-message', {packet: packet.toString('hex'), ip, port, room_name});
            },

            /**
             * 请求店铺配置信息
             * @returns {Promise<void>}
             */
            async initGetTerminal() {
                const _this = this
                const requestData = {
                    'shop_id': _this.shop_id
                }
                const options = {
                    url: this.request_api_address + '/admin/dashboard/getServerIp',
                    method: 'POST',
                    headers: {
                        'x-merchant-id': _this.shop_id,
                        'Content-Type': 'application/json',
                        'authorization-token': ''
                    },
                    body: JSON.stringify(requestData)
                }
                await request(options, function (error, response, body) {
                    if (!error && response.statusCode === 200) {
                        console.log(JSON.parse(body))
                        const {code, data, msg, server_ip} = JSON.parse(body)
                        _this.server_ip = data.server_ip
                        _this.server_port = data.server_port
                        _this.system_port = data.system_port
                        _this.system_ip = data.system_ip
                    }
                })
            },

            /**
             * 发送服务铃按响消息
             * @param message
             * @returns {Promise<void>}
             */
            async sendOpenSystem(message) {
                const data = JSON.parse(message)
                const requestData = {
                    'shop_id': this.shop_id,
                    'room_ip':data.room_ip,
                    'content':data.content,
                    'status':data.status
                }
                const options = {
                    url: this.request_api_address + '/admin/room/insertOpenRoomByCommand',
                    method: 'POST',
                    headers: {
                        'x-merchant-id': this.shop_id,
                        'Content-Type': 'application/json',
                        'authorization-token': ''
                    },
                    body: JSON.stringify(requestData)
                }
                await request(options, function (error, response, body) {
                    if (!error && response.statusCode === 200) {
                        console.log(JSON.parse(body))
                    }
                })
            },
            async getAllRoomForSwitchRoom(){
                let _this = this
                const options = {
                    url: this.request_api_address + '/admin/room/getAllRoomForSwitchRoom',
                    method: 'POST',
                    headers: {
                        'x-merchant-id': this.shop_id,
                        'Content-Type': 'application/json',
                        'authorization-token': ''
                    },
                }
                await request(options, function (error, response, body) {
                    if (!error && response.statusCode === 200) {
                        const {code,data} = JSON.parse(body)
                        if (code == 200 && data){
                                data.forEach(item => {
                                    _this.room_name = item.room_name
                                    _this.room_ip = item.room_ip
                                if (item.room_book_id >0){
                                    _this.openRoom();
                                }else if (item.room_book_id == 0){
                                   _this.closeRoom()
                                }
                            })
                        }
                    }else {
                        clearTimeout(_this.clearTimeout)
                    }
                })
            },
            async sandInterval(){
                let _this = this;
              _this.clearTimeout =  setTimeout( function (){
                    setInterval(async function () {
                       await _this.getAllRoomForSwitchRoom();
                    },5000)
                },0)
            }
        }
    }).mount('#app')

</script>
</body>
</html>
<style>
    .header_content_one {
        display: flex;
        flex-direction: row;
        height: 30px;
        line-height: 30px;
    }

    .header_content {
        display: flex;
        flex-direction: row;
        height: 30px;
        line-height: 30px;
        margin-top: 10px
    }

    .input_content {
        height: 24px;
        width: 120px;
        outline: none;
        box-shadow: 1px 1px 3px rgb(0 0 0 / 50%) inset;
        border: none;
        padding-left: 5px;
    }

    .textarea_content {
        height: 275px;
        width: 100%;
        outline: none;
        box-shadow: 1px 1px 3px rgb(0 0 0 / 50%) inset;
        border: none;
        resize: none;
    }

    .button_style {
        height: 26px;
        outline: none;
        box-shadow: 1px 1px 3px 0px;
        font-size: 12px;
        border: none;
        border-radius: 2px;
        cursor: pointer;
        transition: background-color 0.3s;
    }

    .button_style:active {
        background-color: #47a7ec;
    }
</style>